'use client'
import React from 'react'
import Head from 'next/head'
import { FormProvider } from '@formily/react'
import { FormLayout } from '@formily/antd-v5'
import useLogin from './useLogin'

import styles from './index.module.scss'
import { Button } from 'antd'

const Login = () => {
  const { form, schema, SchemaField, isLogin, handleSubmit } = useLogin()

  return (
    <div className={styles.loginPage}>
      <Head>
        <title>登录</title>
        <meta name="description" content="请登录"></meta>
      </Head>
      <h2>登录</h2>
      <FormProvider form={form}>
        <FormLayout labelCol={6} wrapperCol={18} colon className={styles.loginForm}>
          <SchemaField schema={schema} />
        </FormLayout>
      </FormProvider>
      <Button type="primary" loading={isLogin} onClick={handleSubmit}>
        登录
      </Button>
    </div>
  )
}

export default Login
